{% include header.html %}

<div class="container container-left">
	<div class="row">
		<div class="col-md-3 hidden-xs">
			{% include sidebar.html %}
		</div>
		<div class="col-md-9">
			<div class="well">
				<div class="row">
					<div class="col-md-12 aside3-title">
						<br>
						<h3 id="#identifier">
							我的书单
						</h3>
					</div>
					<div class="col-md-12 aside3-content">
						<div class="row">
							{% for book in page.books %}
							<div class="col-md-12">
								<div class="panel panel-primary" style="border-color: #d0d4d8;">
									
									<div class="panel-body">
										<div class="row">
											<div class="col-md-2 col-xs-6 center">
												<img src="{{ book.cover }}" alt="cover" class="img-thumbnail">
											</div>
											<div class="col-md-10 col-xs-6">
												<table class="table">
														<tr>													
															<td style="border-top: 0px solid #e5e5e5;font-size: 17px;">
																<font color="#08c">{{ book.title }}</font>
															</td>
														</tr>														
														
														<tr>															
															<td>
																{{ book.description }}
															</td>
														</tr>													
												</table>
											</div>
										</div>
									</div>
								</div>
							</div>
							{% endfor %}
						</div>
						<hr>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

{% include footer.html %}

<script type="text/javascript">
		 $(document).ready(function(){
		    $("#books").addClass("active").siblings().removeClass("active");
	     }); 
</script>